<!--
 * @Author: xiaxia
 * @Description: 
 * @Date: 2022-09-19 14:18:49
 * @LastEditTime: 2023-06-08 16:19:55
 * @FilePath: \test-demo\src\components\Printest\printImge.vue
-->
<!--
 * @Author: xiaxia
 * @Description: 
 * @Date: 2022-09-19 14:18:49
 * @LastEditTime: 2023-04-04 10:50:30
 * @FilePath: \test-demo\src\App.vue
-->
<template>
  <div id="test">
    <el-button @click="print1">打印图片</el-button>
    <!-- <img src="./assets/qwer.png" /> -->
  </div>
</template>

<script>
import { getLodop } from './util/print'
import imgsrc from '../../assets/qwer.png'

export default {
  name: 'App',
  data() {
    return {
      imgsrc
      // imgsrc:'',
    };
  },
  components: {

  },
  methods:{
    print1() {
      let LODOP = getLodop()
      LODOP.PRINT_INIT("订单信息打印");
      LODOP.SET_PRINT_STYLE("FontSize", 12);
      LODOP.SET_PRINT_PAGESIZE(2, "297mm", "210mm", "A4"); // 纸张方向大小
      LODOP.SET_PRINT_STYLEA(0, "TableHeightScope", 3); //高度包含页尾
      LODOP.ADD_PRINT_SETUP_BKIMG(`"<img border='0' src=${this.imgsrc}>"`); //背景图
      LODOP.SET_SHOW_MODE("BKIMG_LEFT", "0mm");
      LODOP.SET_SHOW_MODE("BKIMG_TOP", "0mm");
      LODOP.SET_SHOW_MODE("BKIMG_WIDTH", "197mm");
      LODOP.SET_SHOW_MODE("BKIMG_HEIGHT", "210mm"); //这句可不加，因宽高比例固定按原图的
      LODOP.SET_SHOW_MODE("BKIMG_IN_PREVIEW", 1);
      LODOP.SET_PRINT_PAGESIZE(2, 2970, 2100, 'a4') // 纸张方向大小
      LODOP.SET_SHOW_MODE("LANDSCAPE_DEFROTATED", 1); //横向时的正向显示
      LODOP.SET_PRINT_STYLEA(0, "Stretch", 1)
      LODOP.PREVIEW();

      // --------------------------------------
      // let LODOP = getLodop()
      // LODOP.PRINT_INIT("订单信息打印");
      // LODOP.ADD_PRINT_IMAGE(30,150,400,400,"<img border='0' src='http://www.c-lodop.com/demolist/PrintSample8.jpg' />");
      // LODOP.PREVIEW();
      


      // -----------------------
      // let imgsrc=''
      // let LODOP = getLodop()
      // LODOP.PRINT_INIT("订单信息打印");
      // LODOP.ADD_PRINT_IMAGE(100,100,"100%","100%",this.imgsrc);
      // LODOP.PREVIEW();
    }
  }
}
</script>

<style>
</style>